<template>
    <el-table
      :data="tableData"
      border
      style="width: 90%; margin: 20px auto;border-radius: 8px; margin: 20px auto;box-shadow: 5px 5px 10px rgba(64, 158, 255, 0.5);"
      :header-cell-style="{
          'background': '#337ecc !important',
          'color': '#ffffff',
          'border': 'none !important'
        }">
      <el-table-column prop="empName" label="被考核人" width="120"/>
      <el-table-column prop="target" label="考核条目" />
      <el-table-column prop="score" label="评分" width="100"/>
      <el-table-column prop="scorePercent" label="考核条目占比/%" width="140"/>
      <el-table-column prop="assessorName" label="评分人" width="120"/>
      <el-table-column prop="assessorPercent" label="评分人占比/%" width="120"/>
    </el-table>
</template>

<script setup>
import {ref, onBeforeMount, reactive,getCurrentInstance,watch} from "vue";

let props = defineProps({
  scoreList: {
    type: Array,
    required: true, //是否规定必须得有
  }
})
watch(props, (newValue, oldValue) => {
  tableData.value=newValue.scoreList
},{ deep: true });  

const Form = reactive([])
const tableData=ref(props.scoreList)
</script>
<style lang="scss" scoped>

</style>
